import React from 'react';
import { observer} from 'mobx-react';
import { timelineProps } from '.';
import loadjs from 'loadjs';
import {WeaAlertPage} from 'ecCom'

@observer
export default class Container extends React.Component<timelineProps, any>{

    componentDidMount() {
        const {timelineStore}=this.props;
        let jsFiles:string[]=[];
        jsFiles=[...jsFiles,'/formmode/e9resource/timeline/moment.js','/formmode/e9resource/timeline/vis.min.js','/formmode/e9resource/timeline/vis.min.css','/formmode/e9resource/timeline/template.js'];
        if (!loadjs.isDefined('vis')) {
            loadjs(jsFiles, 'vis', {
                    success: () => {
                        timelineStore.init();
                    }
                });
        } else {
            timelineStore.init();
        }
    }

    render(){
        const {timelineStore}=this.props;
        if(timelineStore.hasData){
            return <div id="cube_timeline_container" className="cube_timeline_container" style={{overflow:'hidden'}}>

            </div>
        }else{
            return <div style={{position : 'relative', height : 230}}>
            <WeaAlertPage icon="icon-coms-blank">
                <div style={{ color: '#000' }}>
                    暂无数据！
                </div>
            </WeaAlertPage>
        </div>
        }
    }
}